<template>
  <!-- 这是约课 场次的期数  组件 （sectionInfo 和 activityDetail用到）-->
  <div>
    <template v-if="dataInfo.reservationMode == 2">
      <div class="c-flex-row c-bd-t10 c-pt30 c-ph24 c-aligni-center" id="sectionPeriods" v-if="periodsList.length > 0">
        <span class="c-flex-grow1 c-fw-b c-w0 c-fs26 c-fc-xblack">场次选择</span>
      </div>
      <div class="c-mh24 c-pb120">
        <div class="c-pv30 c-mt30 c-ph20 c-bg-white c-fs24 c-fc-xblack c-br8 c-bd1-mgray" v-for="(item, index) in periodsList" :key="index" @click="choosePeriods(item, index)" :class="{'theme-bd1': selectRpId == item.rpId, 'c-fc-gray c-bg-fa': item.number == 0}">
          <div class="c-flex-row c-aligni-center">
            <span class="iconfont c-fc-gray c-fs20">&#xe85d;</span><span class="c-pl16">{{item.startAt.substr(0,16)}} 至 {{item.endAt.substr(0,16)}}</span>
          </div>
          <div class="c-flex-row c-aligni-baseline c-mt30" v-if="item.place">
            <span class="iconfont c-fc-gray c-fs20">&#xe8a2;</span><span class="c-pl16">{{item.place}}</span>
          </div>
          <div class="c-flex-row c-aligni-center c-mt30">
            <span class="iconfont c-fc-gray c-fs20 c-pr16">&#xe976;</span>
            <p v-if="item.number == 0">已满</p>
            <p v-else>
              余<span :class="item.number < 10 ? 'theme-fc' : ''">{{item.number}}</span>张
            </p>
          </div>
        </div>
        <loading-status-tem :noData="from == 'sectionInfo' && periodsList.length <= 0" :noDataText="'暂无场次'"></loading-status-tem>
      </div>
    </template>
    <template v-if="dataInfo.reservationMode == 1">
      <div :class="companyAuth.enableShowInfo != 1?'c-pb88':''">
        <div class="c-w100 c-bg-white c-bd-t12-f5">
          <div class="c-w100 c-flex-row c-justify-sb c-aligni-center c-pt24 c-ph24">
            <p class="c-fs24 c-fc-xblack c-fw500">时间选择
              <span class="c-fc-gray c-fw400">(必填)</span>
            </p>
            <div class="c-fs20 theme-fc" @click.stop="handleClickOpenModal()">
              <i class="iconfont c-fs24">&#xe67f;</i> 日期选择
            </div>
          </div>
          <div class="c-flex-row c-justify-sb c-aligni-center c-w100 c-mt28 c-ph24 c-pb10 c-contextX-scroll menu-scroll-view" id="tabScrollContent" ref="tabScrollContent">
            <div class="c-ww60 c-flex-column c-flex-center menu-tab-item" :class="index == myCalendarList.length -1 ?'':'c-mr28'" v-for="(item, index) in myCalendarList" :key="index" @click.stop="handleClickSelectCalendar(item, index)">
              <div class="c-fs20" :class="selectIndex == index ?'c-fc-xblack':'c-fc-sgray'">{{item.week}}</div>
              <div class="c-ww60 c-hh60 c-flex-row c-flex-center c-fs22 c-fw500 c-mt18" :class="selectIndex == index?'c-fc-white c-br50 theme-bg':''">{{item.day}}</div>
            </div>
          </div>
          <div class="c-pb24" v-if="myCalendarList.length > 0">
            <div class="c-flex-row c-flexw-wrap c-maxh480 c-contexty-scroll c-scroll-touch">
              <div class="c-w25 c-flex-row c-flex-center c-mt28" v-for="(item, index) in myCalendarList[selectIndex].enrollTimes" :key="index" @click.stop="handleClickSelectTime(item, index)">
                <div class="c-ww120 c-hh52 c-br28 c-fs22  c-flex-row c-flex-center " :class="selectTimeIndex == index ?'c-fc-white theme-bg':'c-fc-xblack c-bg-f6'">{{item}}</div>
              </div>
            </div>
            <loading-status-tem
              :noData="myCalendarList[selectIndex].enrollTimes.length == 0"
              :pt20="true"
              :noDataText="'暂无数据'"
            ></loading-status-tem>
          </div>
        </div>
        <div class="c-w100 c-bg-white c-bd-t12-f5" v-if="dataInfo.coachChoice != 3">
          <div class="c-w100 c-flex-row c-justify-sb c-aligni-center c-pt24 c-ph24">
            <p class="c-fs24 c-fc-xblack c-fw500">教练
              <span class="c-fc-gray c-fw400">{{dataInfo.coachChoice == 2 ?'(选填)':'(必填)'}}</span>
            </p>
            <div class="c-fs20 c-fc-gray" @click.stop="handleClickCoach()">更多
              <i class="iconfont c-fs14">&#xe85a;</i>
            </div>
          </div>
          <div class="c-flex-row c-pt28 c-pb24 c-ph24">
            <template v-for="(item, index) in coachList">
              <div class="c-ww132 c-flex-row c-flex-center" v-if="index < 4" :key="index" :class="index == coachList.length - 1?'':'c-mr20'">
                <div class="c-ww132 c-hh172 c-ph10 c-br8 c-textAlign-c c-flex-column c-aligni-center c-justify-center c-text-ellipsis1" :class="index == selectCoachIndex ? 'theme-bg':'c-bg-f6'" @click.stop="handleClickCoachSelect(item, index)">
                  <img class="c-ww60 c-hh60 c-brp50 imgCloseBig" :src="$addXossFilter(item.avatar || require('@/assets/defult270.png'))" alt="">
                  <p class="c-w100 c-fs22 c-text-ellipsis1 c-mt10" :class="index == selectCoachIndex ?'c-fc-white':'c-fc-xblack'">{{item.name}}</p>
                  <p class="c-w100 c-fs18 c-text-ellipsis1 c-mt8" :class="index == selectCoachIndex ?'c-fc-white':'c-fc-gray'" v-if="item.remainingNum != null">剩余名额:{{item.remainingNum || 0}}</p>
                </div>
              </div>
            </template>
            <loading-status-tem
              class="c-m-0auto"
              :noData="coachList.length == 0"
              :pt20="true"
              :noDataText="'暂无数据'"
            ></loading-status-tem>
          </div>
        </div>
      </div>
      <open-modal :openModal="coachOpenModal" @closeModal="coachCloseModal">
        <div class="c-bg-white c-br-tl20 c-br-tr20 c-text-hidden c-maxw640">
          <div class="c-flex-row c-flex-center c-w100 c-hh78 c-p">
            <span class="c-fs28 c-fc-xblack c-fw600">教练简介</span>
            <div
              class="c-pa c-p-r16 c-ww32 c-hh32 c-flex-row c-flex-center"
              @click.stop="coachCloseModal"
            >
              <i class="iconfont c-fc-sgray c-fs32">&#xe750;</i>
            </div>
          </div>
          <div class="c-w100 c-bg-sgray c-hh540 c-contexty-scroll c-scroll-touch">
            <div class="c-w100 c-ph24 c-pt8 c-mt20">
              <div class="c-w100 c-minh230 c-br15 c-bg-white c-flex-row c-pt24 c-pr24 c-pb24 c-pl24 c-mb20 c-p" :class="index == selectCoachIndex ?'c-bd1-xblue':''" v-for="(item, index) in coachList" :key="index" @click="handleClickCoachSelect(item, index)">
                <div class="c-ww80 c-hh80 c-brp50">
                  <img class="c-ww80 c-hh80 c-brp50" :src="$addXossFilter(item.avatar || require('@/assets/defult270.png'))" alt="">
                </div>
                <div class="c-flex-column c-flex-grow1 c-w0 c-ml20">
                  <p class="c-w100 c-fs24 c-fw600 c-text-ellipsis1">{{item.name}}</p>
                  <p class="c-w100 c-fs20 c-text-ellipsis1 c-mt10 c-bd-b1 c-pb20 c-fc-gray">被预约次数: {{item.totalEnrollNum}}
                    <span v-if="item.remainingNum != null">| 剩余名额: {{item.remainingNum || 0}}</span>
                  </p>
                  <div class="c-pt20 c-w100 c-p">
                    <div class="c-wb-ba c-ws-pw c-fs20 c-fc-gray c-textAlign-j c-lh32" :class="expend ? '':'c-hh64 c-text-ellipsis2'">{{item.introduction || '暂无简介'}}</div>
                    <div class="c-pa c-p-b0 c-p-r0 c-bg-white c-fs20 c-fw500 theme-fc c-lh32" v-if="item.introduction.length > 42" @click.stop="expend = !expend">{{expend ? '收起':'展开'}}
                      <div class="c-inlineblack" :class="expend ? '':'c-rotate180'">
                        <span class="iconfont c-fs14 ">&#xe67a;</span>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="c-pa c-ww48 c-hh48 select-icon" v-if="index == selectCoachIndex">
                  <img class="c-ww48 c-hh48" :src="require('../../assets/i/wap/reservation/select.png')" alt="">
                </div>
              </div>
              <loading-status-tem
                class="c-m-0auto"
                :noData="coachList.length == 0"
                :noDataText="'暂无数据'"
              ></loading-status-tem>
            </div>
          </div>
        </div>
      </open-modal>
      <Calendar :localDate="localDate" :weeked="weeked" :openModal="openModal" @closeModal="closeModal" @itemClick="itemClick"></Calendar>
    </template>
    <div v-if="from == 'sectionInfo' && selectRpId > 0 || (dataInfo.reservationMode == 1 && from == 'sectionInfo')" class="c-ph66 certain-button c-bg-white c-flex-row c-justify-center">
      <div v-if="showNoCanUsedSession" class="c-bg-ccc c-fc-white c-w100 c-hh64 c-fs24 c-flex-row c-flex-center c-br32">当前专场预约次数已用完</div>
      <div v-else-if="showNoSelectSession" class="c-bg-ccc c-fc-white c-w100 c-hh64 c-fs24 c-flex-row c-flex-center c-br32">您已选择了参与其他专场，无法预约当前专场</div>
      <div v-else @click="goToReservation" class="c-fc-white c-w100 c-hh64 c-fs24 c-flex-row c-flex-center c-textAlign-c c-br32 theme-bg">预约上课</div>
    </div>
    <div v-if="from == 'sectionDetail'" class="certain-button">
      <div class="c-hh80 c-w100 c-ph24 c-flex-row c-aligni-center c-justify-sb c-fc-white c-pf c-p-b0 c-maxw640 c-bg-white c-fs24 c-bd-t1">
        <div class="theme-fc theme-bd1 c-hh60 c-br10 c-lh60 c-textAlign-c" :class="showNoSelectSession ? 'c-ww150' : 'c-ww220'" @click="backReservationDetail">
          返回主题
        </div>
        <div class="c-ww350 c-bg-dd c-hh60 c-br10 c-lh60 c-textAlign-c" v-if="periodsList.length <= 0 && dataInfo.reservationMode == 2">
          暂无场次
        </div>
        <div class="c-ww350 c-bg-dd c-hh60 c-br10 c-lh60 c-textAlign-c" v-else-if="dataInfo.status == 0">
          专场已下架
        </div>
        <div class="c-ww350 c-bg-ccc c-hh60 c-br10 c-lh60 c-textAlign-c" v-else-if="showNoCanUsedSession">
          当前专场预约次数已用完
        </div>
        <div class="c-flex-grow1 c-ml20 c-bg-ccc c-hh60 c-br10 c-lh60 c-textAlign-c c-fs22" v-else-if="showNoSelectSession">
          您已选择其他专场，无法预约当前专场
        </div>
        <div class="c-ww350 c-bg-ccc c-hh60 c-br10 c-lh60 c-textAlign-c" v-else-if="showNoTimes">
          预约次数已用完
        </div>
        <div class="c-ww350 c-bg-ccc c-hh60 c-br10 c-lh60 c-textAlign-c" v-else-if="dataInfo.enrollMode == 2 && dataInfo.isEnroll == -3">
          订单过期
        </div>
        <div v-else>
          <div class="c-ww350 theme-bg c-hh60 c-br10 c-lh60 c-textAlign-c" v-if="(isEnroll > 1 || reId) || (dataInfo.enrollMode ==2 && dataInfo.residueDegree !=0) || (dataInfo.reservationMode == 1 && dataInfo.residueDegree != 0)" @click="goToReservation">
            预约上课
          </div>
          <div class="c-ww350 theme-bg c-hh60 c-br10 c-lh60 c-textAlign-c" v-else @click="linkToTicketNum">
            预约信息
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import loadingStatusTem from "@/components/templates/common/loadingStatusTem.vue";
import Calendar from '@/components/templates/common/calendar.vue'
import OpenModal from "@/components/templates/common/openModal.vue";
import { utilJs } from "@/utils/common.js";
export default {
  components: { loadingStatusTem, Calendar, OpenModal },
  props: {
    periodsList: {
      type: Array,
      default: () => []
    },
    // 场次信息 sectionInfo  场次详情：sectionDetail
    from: {
      type: String,
      default: 'sectionInfo',
    },
    isEnroll: { // 是否预约成功 1 预约成功 2没预约
      type: Number,
      default: 2,
    },
    rtId: {
      type: Number,
      default: -1
    },
    rpId: { // 预约的场期id 改签过来的时候用到（原来预约的那个场期id）
      type: Number,
      default: -1,
    },
    reId: { // 改签的id
      type: String,
      default: '',
    },
    dataInfo: { // 专场的信息 限专场 限制次数的
      type: Object,
      default: function () {
        return {}
      }
    },
    myCalendarList: {
      type: Array,
      default: []
    },
    selectIndex: {
      type: Number,
      default: 0
    },
    selectTimeIndex: {
      type: Number,
      default: 0
    },
    selectTime: {
      type: String,
      default: ""
    },
    // 今天周几
    weeked: {
      type: String,
      default: "",
    },
    // 今天日期
    localDate: {
      type: String,
      default: ""
    },
    coachList: {
      type: Array,
      default: []
    },
    selectCoachIndex: {
      type: Number,
      default: 0
    },
    coachObject: {
      type: Object,
      default: null
    },
    selectCityIndex: {
      type: Number,
      default: 0
    }
  },
  data() {
    return {
      theme: localStorage.getItem("colorName") ? localStorage.getItem("colorName") : 'mb5_default',
      selectRpId: 0, // 选择的场次id
      selectItem: {}, // 选择的场次信息
      companyAuth: JSON.parse(localStorage.getItem("companyAuth")),
      chooseItem: 0,
      openModal: false,
      coachOpenModal: false,
      expend: false,
      menuWidth: 0,
      menuItemWidth: 0,
    }
  },
  computed: {
    showNoCanUsedSession() { // 是否显示当前专场预约次数已用完
      if (this.dataInfo.isEnroll != 1 && this.dataInfo.timesRestriction == 2 && this.dataInfo.residueDegree == 0) { // 每专场限制几次的次数用完了
        if (this.reId && this.dataInfo.enrollSessionIds.length > 0) { // 改签的情况 那只能改签有次数的并且上次预约的
          if (this.from == 'sectionInfo') { // 场次页面
            if (this.dataInfo.reservationMode == 1) {
              let isenrollSessionId = this.dataInfo.enrollSessionIds.some((rsId) => {
                return rsId == this.dataInfo.rsId
              })
              return !isenrollSessionId;
            } else {
              let isenrollSessionId = this.dataInfo.enrollSessionIds.some((rsId) => {
                return rsId == this.selectItem.rsId
              })
              return !isenrollSessionId;
            }
          } else { // 专场详情页面 默认没选中场期，所以直接取路由上面的专场id
            let isenrollSessionId = this.dataInfo.enrollSessionIds.some((rsId) => {
              return rsId == this.$route.query.rsId
            })
            return !isenrollSessionId;
          }
        }
        return true
      } else {
        return false
      }
    },
    showNoSelectSession() { // 是否限制专场 并且预约了别的专场
      if (this.dataInfo.sessionRestriction == 1 && this.dataInfo.enrollSessionIds.length > 0) { // 已经预约的专场id不等于选择的专场id
        if (this.from == 'sectionInfo') { // 场次页面
          if (this.dataInfo.reservationMode == 1) {
            let isenrollSessionId = this.dataInfo.enrollSessionIds.some((rsId) => {
              return rsId == this.dataInfo.rsId
            })
            return !isenrollSessionId;
          } else {
            let isenrollSessionId = this.dataInfo.enrollSessionIds.some((rsId) => {
              return rsId == this.selectItem.rsId
            })
            return !isenrollSessionId;
          }
        } else { // 专场详情页面 默认没选中场期，所以直接取路由上面的专场id
          let isenrollSessionId = this.dataInfo.enrollSessionIds.some((rsId) => {
            return rsId == this.$route.query.rsId
          })
          return !isenrollSessionId;
        }
      } else {
        return false
      }
    },
    showNoTimes() { // 没次数预约了
      if (this.companyAuth.enableDeclareModule == 0 && (((this.dataInfo.isEnroll != 1 && this.dataInfo.enrollMode == 1) || (this.dataInfo.isEnroll == 1 && this.dataInfo.enrollMode == 2)) && this.dataInfo.residueDegree == 0 && !this.reId)) {
        return true
      } else {
        return false
      }
    }
  },
  watch: {
    periodsList: {
      handler: function (newValue, oldValue) {
        if (this.from == 'sectionInfo') {
          let canSelectItem = newValue.filter(item => item.number > 0)
          this.selectRpId = canSelectItem.length > 0 ? canSelectItem[0].rpId : 0;
          this.selectItem = canSelectItem[0];
        } else {
          this.selectRpId = 0;
        }
      },
      deep: true,
      checkStatus: ''
    }
  },
  methods: {
    coachCloseModal() {
      this.coachOpenModal = false;
    },
    handleClickCoach() {
      this.coachOpenModal = true;
    },
    handleClickCoachSelect(item, index) {
      if (this.coachOpenModal) {
        this.coachOpenModal = false;
      }
      this.$emit("handleClickCoachSelect", item, index)
    },
    handleClickSelectTime(item, index) {
      this.$emit('handleClickSelectTime', item, index);
    },
    handleClickSelectCalendar(item, index) {
      this.$emit('handleClickSelectCalendar', item, index);
      this.handleScroll(index);
    },
    itemClick(obj) {
      if (!obj.isClick) return;
      this.openModal = false;
      this.$emit('itemClick', obj)
    },
    closeModal() {
      this.openModal = false;
    },
    handleClickOpenModal() {
      this.openModal = true;
    },
    handleScroll(index) {
      this.$nextTick(() => {
        let left = document.getElementById('tabScrollContent').childNodes[index] ? document.getElementById('tabScrollContent').childNodes[index].offsetLeft : 0;
        if (this.menuWidth == 0 || this.menuItemWidth == 0) {
          this.getEleWidth('.menu-scroll-view', 'menuWidth');
          this.getEleWidth('.menu-tab-item', 'menuItemWidth');
        }
        this.$refs.tabScrollContent.scrollTo({
          left: left + this.menuItemWidth / 2 - this.menuWidth / 2,
          behavior: 'smooth'
        })
      })
    },
    getEleWidth(elClass, dataVal) {
      new Promise((resolve, reject) => {
        const query = document.querySelector(elClass);
        if (!query) {
          setTimeout(() => {
            this.getEleWidth(elClass);
          }, 10);
          return;
        }
        this[dataVal] = query.offsetWidth;
      })
    },
    choosePeriods(item, index) { // 选择场期 如果没有余票 return
      if (item.number <= 0) {
        return;
      }
      this.selectRpId = item.rpId;
      this.selectItem = item;
      this.chooseItem = index;
    },
    checkDateStatus(item) { // 验证选择的场次是否在有效期内 0709新增
      var $this = this
      let ObjectDate = {
        rtId: $this.rtId,
        rpId: $this.selectRpId,
        rsId: $this.selectItem && $this.selectItem.rsId || '',
        reId: $this.reId || ''
      }
      if (this.dataInfo.reservationMode == 1) {
        ObjectDate.enrollDate = this.localDate;
        ObjectDate.enrollTime = this.selectTime;
        ObjectDate.coachId = this.coachObject && this.coachObject.adminUserId || '';
        ObjectDate.rsId = this.dataInfo.rsId;
      }
      return new Promise((resolve, reject) => {
        utilJs.postMethod(global.apiurl + "reservations/checkOrderValid",
          ObjectDate,
          function (res) {
            resolve()
          }
        )
      })
    },
    goToReservation() { // 场次详情那边的预约上课
      this.validatePeriods();
    },
    validatePeriods() { // 判断是否选择了场次 没选择场次就点预约
      console.log(this.selectTime)
      if (this.selectRpId <= 0 && this.dataInfo.reservationMode == 2) {
        this.$showCjToast({
          text: "请选择场次！",
          type: "warn",
        });
        if (this.from == 'sectionDetail') { // 没选择场次  如果没在视线范围，要滚动到场次选择这边
          var el = this.$el.querySelector('#sectionPeriods');
          if (!el) { return; };
          document.documentElement.scrollTop = el.offsetTop - 52;
          if (document.documentElement.scrollTop == 0) {
            document.body.scrollTop = el.offsetTop - 52;
          }
        }
        return false;
      }
      // 门店预约模式
      if (this.dataInfo.reservationMode == 1) {
        let selectDate = `${this.localDate} ${this.selectTime}`;
        let nowDateStr = utilJs.getNowTime();
        if (this.myCalendarList[this.selectIndex].enrollTimes.length == 0) {
          this.$showCjToast({
            text: "当前暂无可预约时间",
            type: "warn"
          });
          return;
        }
        if (this.coachList.length == 0 && this.dataInfo.coachChoice == 1) {
          this.$showCjToast({
            text: "当前暂无可预约的教练",
            type: "warn"
          });
          return;
        }
        if (new Date(selectDate.replace(/-/g, "/")) < new Date(nowDateStr.replace(/-/g, "/"))) {
          this.$showCjToast({
            text: "请选择有效时间段",
            type: "warn"
          });
          return;
        }
        if (this.coachObject != null && this.coachObject.remainingNum == 0) {
          this.$showCjToast({
            text: "预约名额已满,请选择其他教练",
            type: "warn"
          });
          return;
        }
      }
      if (this.companyAuth.enableDeclareModule == 0) { // 约课验证有效期  聚尚美不要
        // 验证是否是限专场的约课，如果是的话弹框提示只能预约一个专场
        if (this.dataInfo.sessionRestriction == 1 && this.dataInfo.enrollSessionIds.length == 0) {
          this.$cjConfirm({
            title: '预约确认',
            message: '该主题仅支持预约其中一个专场，是否确认预约该专场',
            onConfirm:() => {
              this.checkDateStatus().then(() => {
                this.checkIsReset();
              })
            }
          })
          return;
        }
        this.checkDateStatus().then(() => {
          // 连续模式 如果同个场次预约过
          if (this.dataInfo.reservationMode == 2 && this.dataInfo.enrollMode == 2 && this.periodsList[this.chooseItem].hasEnrollLog == 1 && this.selectRpId != this.rpId) {
            this.$cjConfirm({
              title: '提示',
              message: '您已预约过当前场次',
              confirmButtonText:'确认预约',
              cancelButtonText:'我再看看',
              onConfirm:() => {
                this.checkIsReset();
              }
            })
          } else {
            this.checkIsReset();
          }
        })
        return;
      }
      this.checkIsReset();
    },
    checkIsReset() { // 检查是否改签
      // 验证改签的票是否与原场次相同
      if (this.selectRpId == this.rpId && (this.dataInfo.reservationMode == 2)) {
        this.$cjConfirm({
          title: '提示',
          message: '您改签的场次信息与原场次完全相同，请查看信息是否有误，以免影响正常上课！',
          confirmButtonText:'确认无误',
          cancelButtonText:'我再看看',
          onConfirm:() => {
            this.linkToEnroll();
          }
        })
        return;
      }
      this.linkToEnroll()
    },
    /**
     *  约课主题id(rtId)
     * 场次id(rsId)
     * 场次下的场期id(rpId）
     * 改签id（reId）
     */
    linkToEnroll() { // 跳转至报名表单那边
      let query = {};
      if (this.dataInfo.reservationMode == 2) {
        query.rtId = this.selectItem.rtId;
        query.rsId = this.selectItem.rsId;
        query.rpId = this.selectRpId;
        query.reId = this.reId;
      } else {
        query.rtId = this.rtId;
        query.rsId = this.dataInfo.rsId;
        query.rpId = this.selectRpId;
        query.reId = this.reId;
        query.enrollDate = this.localDate;
        query.enrollTime = this.selectTime;
        query.coachId = this.coachObject && this.coachObject.adminUserId || '';
        query.reservationMode = this.dataInfo.reservationMode
      }
      this.$routerGo(this, "replace", {
        path: '/homePage/reservation/reservationEnroll',
        query: query
      });
    },
    backReservationDetail() { // 返回约课主题
      this.$routerGo(this, "push", {
        path: "/activity/activityDetail",
        query: { ActivityNo: this.$route.query.ActivityNo, from: 'reservation', rpId: this.selectRpId ? this.selectRpId : '', reId: this.reId }
      });
    },
    linkToTicketNum() { // 点击预约信息
      this.$routerGo(this, "push", {
        path: "/activity/ticketNum",
        query: { activityId: this.$route.query.ActivityNo, from: 'reservation' }
      });
    },
  },
  mounted() {
  },
  activated() {
    this.chooseItem = 0;
  },
  deactivated() { }
}
</script>
<style scoped>
.certain-button {
  position: fixed;
  bottom: 0;
  height: 2.2rem;
  z-index: 11;
  max-width: 640px;
  width: 100%;
  display: flex;
  display: -webkit-flex;
  align-items: center;
  -webkit-align-items: center;
}
.week {
  width: 14.28%;
}
.c-minh230 {
  min-height: 5.75rem;
}
.select-icon {
  top: -1px;
  right: -1px;
}
</style>
